<template>
    <el-collapse accordion>
      <el-collapse-item :title="d.name+'【'+d.job+'】'" :name="d.id" v-for="d in docs" :key="d.id" >
        <div class="link">
          <el-avatar size="large" :src="'http://localhost:9999/imgs/doc/'+d.photo"/>
          <b>职称:{{d.job}}</b><br/>
          科室:{{d.deptName}} 科室电话:{{d.map.dept.phone}}  位置:{{d.map.dept.loc}} 
          
          <div class="btn_doc" style="margin-top:-50px">
           <router-link :to="{path:'/docdetail',query:{docid:d.id}}" > 
              <el-button type="warning" round size="small" style="margin:5px 0px">详细介绍</el-button>
           </router-link><br/>
           <router-link :to="{path:'/plan',query:{empno:d.empNo}}" > 
              <el-button type="success" round size="small">查看排班</el-button>
           </router-link>
          </div>
        </div>
        <div class="txt">
          {{d.docdesc}}
        </div>
      </el-collapse-item>
    </el-collapse>
</template>

<script>
import { useRoute,useRouter } from 'vue-router'

export default {
   inject:["global"],
   data(){
       return{
           docs:[]
       }
   },
   mounted:function(){
       const route=useRoute();
       const axios=this.global.axios;
       axios.get("http://192.168.2.5:9000/hp/doc/findbydept?deptname="+route.query.deptname)
       .then(resp=>{
           this.docs=resp.data.obj;
       })
   }
}
</script>

<style scoped>
   .txt,.link{text-align: left;}
   .btn_doc{float:right}
</style>